<template>
	<view>
		<view class="top">
			<view style="overflow: hidden;"></view>
			<view class="top-search">
				<u-search placeholder="搜索地点、回收站点" v-model="keyword" :showAction='false' shape="square" bgColor='#F9FAFC'></u-search>
			</view>
			<view class="top-title">
				当前站点
			</view>
			<view class="top-bottom">
				重庆市渝北区世茂茂悦府-三期1栋27-8
			</view>
			<view class="top-btn">
				重新定位
			</view>
		</view>
		<view class="main">
			<view style="overflow: hidden;"></view>
			<view class="main-top">
				附近站点
			</view>
			<view class="main-main">
				<view class="main-main-top">
					双桥经开区废旧物资回收站
				</view>
				<view class="main-main-bottom">
					重庆市渝北区背部新区金州大道重光立交旁
					(照母山公园附近)
				</view>
				<view class="main-main-right">
					<image src="https://yhflsyz.oss-cn-guangzhou.aliyuncs.com/img/Group%201568.png" mode="" class="right-img"></image>
					155m
				</view>
			</view>
			<view class="main-main">
				<view class="main-main-top">
					双桥经开区废旧物资回收站
				</view>
				<view class="main-main-bottom">
					重庆市渝北区背部新区金州大道重光立交旁
					(照母山公园附近)
				</view>
				<view class="main-main-right">
					<image src="https://yhflsyz.oss-cn-guangzhou.aliyuncs.com/img/Group%201568.png" mode="" class="right-img"></image>
					155m
				</view>
			</view>
			<view class="main-main">
				<view class="main-main-top">
					双桥经开区废旧物资回收站
				</view>
				<view class="main-main-bottom">
					重庆市渝北区背部新区金州大道重光立交旁
					(照母山公园附近)
				</view>
				<view class="main-main-right">
					<image src="https://yhflsyz.oss-cn-guangzhou.aliyuncs.com/img/Group%201568.png" mode="" class="right-img"></image>
					155m
				</view>
			</view>
			<view class="main-main">
				<view class="main-main-top">
					双桥经开区废旧物资回收站
				</view>
				<view class="main-main-bottom">
					重庆市渝北区背部新区金州大道重光立交旁
					(照母山公园附近)
				</view>
				<view class="main-main-right">
					<image src="https://yhflsyz.oss-cn-guangzhou.aliyuncs.com/img/Group%201568.png" mode="" class="right-img"></image>
					155m
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
			data() {
				return {
					keyword: ''
				}
			},
			onLoad() {
				uni.getLocation({
					type: 'gcj02',
					 isHighAccuracy: true,
					success: function (res) {
						location={
							lng:res?.longitude,
							lat:res?.latitude
						}
						console.log(res,'我是res');
					},
					fail: function (e)
					{
						
					}
				});
			}
		}
</script>

<style>
	.top{width: 95%;margin-left: 2.5%;background-color: white;border-radius: 16rpx;height: 270rpx;margin-top: 30rpx;position: relative;}
	.top-search{width: 90%;margin-left: 5%;margin-top: 30rpx;}
	.top-title{width: 90%;margin-left: 5%;font-size: 24rpx;color: #A1A3A0;margin-top: 30rpx;}
	.top-bottom{width: 65%;margin-left: 5%;margin-top: 30rpx;height: 32rpx;font-size: 28rpx;line-height: 32rpx;color: black;font-weight: bold;white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	.top-btn{position: absolute;right: 40rpx;bottom: 50rpx;font-size: 28rpx;font-weight: bold;color: #36BE6A;}
	.main{width: 95%;margin-left: 2.5%;background-color: white;border-radius: 16rpx;margin-top: 30rpx;}
	.main-top{width: 90%;margin-left: 5%;margin-top: 30rpx;margin-bottom: 20rpx;}
	.main-main{width: 90%;margin-left: 5%;margin-top: 10rpx;border-bottom: 1px #EEEEEE solid; position: relative;height: 150rpx;}
	.main-main-top{font-size: 28rpx;font-weight: bold;width: 460rpx;color: black;}
	.main-main-bottom{font-size: 28rpx;width: 460rpx;}
	.main-main-right{position: absolute;right: 20rpx;bottom: 50rpx;font-size: 28rpx;}
	.right-img{width: 28rpx;height: 28rpx;}
</style>